<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>VueJs指令：v-on：事件修饰符</title>
    <style>
        [v-cloak]{display: none}
    </style>
</head>
<body>

<div id="app" v-cloak>
    <p>用户：<input type="text" id="username"></p>
    <p>密码：<input type="text" id="password" @keyup.enter="logined"></p>
    <p>密码：<input type="text" id="password4" @keyup.ctrl.enter="logined" placeholder="ctrl.enter"></p>
    <p>密码：<input type="text" id="password2" @keyup.13="logined"></p>
    <p>密码：<input type="text" id="password3" @keyup.65="logined" placeholder="a"></p>
    <p>密码：<input type="text" id="password33" onkeydown="getKeycode(event)"></p>
    <p>
        <button @click="logined2">登录</button>
    </p>
</div>

<script src="js/vue.min.js"></script>
<script >
    // 默认行为：在节点中默认行为的元素不多：a button input submit拥有默认行为
    // data定义数据的目的：它是不是就把视图中需要替换的输数据用js对象来进行定义，data
    new Vue({
        el:"#app",
        data:{
            filter:function(value){
            }
        },
        methods:{
            logined:function(){
                alert("点击了登录.....");
            }
        }
    })
</script>

</body>
</html>